<template>
  <user-card-list :user-list="userList"/>
  <van-empty v-if="!userList || userList.length<1" description="搜索结果为空"/>
</template>

<script setup>

import {useRoute} from "vue-router";
import {onMounted, ref} from "vue";
import qs from 'qs'
import myAxios from "../plugins/myAxios.ts";
import {showSuccessToast, showFailToast} from 'vant';
import UserCardList from "../components/UserCardList.vue";


const route = useRoute();
const {tags} = route.query;
const userList = ref([]);
onMounted(async () => {
  const userListData = await myAxios.get('/userInfo/searchByTags', {
    params: {
      tagNameList: tags
    },
    paramsSerializer: params => {
      return qs.stringify(params, {indices: false})
    }
  }).then(res => {
    showSuccessToast('请求成功');
    return res.data
    // userList.value = res.data
  }).catch(() => {
    showFailToast('请求失败');
  })
  if (userListData) {
    userListData.forEach(user => {
      if (user.tags) {
        user.tags = JSON.parse(user.tags)
      }
    })
    userList.value = userListData
  }
})


</script>
<style scoped>

</style>